<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>用户授权 | {$system_name}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="icon" type="image/png" href="{_ADMIN_STATIC_}/i/favicon.png">
    <link rel="stylesheet" href="{_ADMIN_STATIC_}/css/amazeui.min.css" />
    <link rel="stylesheet" href="{_ADMIN_STATIC_}/css/admin.css">
    <link rel="stylesheet" href="{_ADMIN_STATIC_}/css/app.css">

</head>

<body data-type="index">
    <!-- 头部导航栏 -->
    {include file='public/header'}
    <!-- 左侧侧边栏 -->
    {include file='public/side'}
    <!-- 中间内容开始 -->

    <!-- 标题 -->
    <div class="tpl-content-page-title">
        {$system_name} -- 用户授权
    </div>
    <!-- 面包屑导航 -->
    <ol class="am-breadcrumb">
        <li><a href="{:url('User/index')}" class="am-icon-home">用户管理</a></li>
        <li>用户授权</li>
    </ol>
    <!-- 提示信息 -->
    <div class="tpl-content-scope">
        <div class="note note-info">
            <h3> 用户授权
                <span class="close" data-close="note"></span>
            </h3>
            <p>用户授权</p>
            <p><span class="label label-danger">提示:</span>
                前端用户的管理，与后端用户无关
            </p>
        </div>

        <div class="tpl-portlet-components">

            <!-- 添加权限 -->
            <div class="portlet-title">
                <div class="caption font-green bold">
                    <span class="am-icon-code"></span> 添加权限&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    账号： {$user_info.account} &nbsp;&nbsp;&nbsp;&nbsp; 用户名：{$user_info.name}
                </div>
            </div>
            <div class="tpl-block">
                <div>
                    <select id="rid">
                        {volist name="role_info" id="row"}
                        <option value="{$row.id}">{$row.name}</option>
                        {/volist}
                    </select>
                    <button type="button" style="margin-left: 40px;" class="am-btn am-btn-primary"
                        onclick="save()">添加角色</button>
                </div>
            </div>

            <!-- 已授予的权限 -->
            <div class="portlet-title">
                <div class="caption font-green bold">
                    <span class="am-icon-code"></span> 已授予的权限
                </div>
            </div>
            <div class="tpl-block">

                <style>
                    .tpl-label-info {
                        display: inline-block;
                        margin: 5px;
                        padding: 5px;
                        font-size: 18px;
                    }
                </style>
                {volist name="user_role_info" id="row"}
                <span class="tpl-label-info"> {$row.name}
                    <i class="am-icon-times" onclick="del_role('{$row.id}','{$row.name}')"></i>
                </span>
                {/volist}

            </div>


        </div>
    </div>


    <!-- 中间内容结束 -->
    <!-- 底部 -->
    <!-- {include file="public/footer"} -->

    <script src="{_ADMIN_STATIC_}/lib/jquery/jquery.js"></script>
    <script src="{_ADMIN_STATIC_}/js/amazeui.min.js"></script>
    <script src="{_ADMIN_STATIC_}/js/app.js"></script>
    <script src="{_ADMIN_STATIC_}/lib/layer/layer.js"></script>
    <script>

        // 添加角色
        function save() {
            var uid = "{$user_info.id}";
            var rid = $('#rid').val().trim();

            var data = {
                'uid': uid,
                'rid': rid,
            };

            $.ajax({
                url: "{:url('User/add_user_role')}",
                data: data,
                type: "POST",
                dataType: "JSON",
                success: function (res) {
                    if (res.code == 0) {
                        return layer.msg(res.msg, { icon: 1, time: 900 }, function () {
                            location.reload();
                        });
                    } else {
                        return layer.msg(res.msg, { icon: 2, time: 900 });
                    }
                }
            });
        }

        // 取消授权
        function del_role(id, name) {
            layer.confirm('确定取消授权该角色[ ' + name + ' ]', {
                btn: ['确定', '取消'] //按钮
            }, function () {
                $.ajax({
                    url: "{:url('User/del_user_role')}",
                    data: {
                        'id': id,
                    },
                    type: "POST",
                    dataType: "JSON",
                    success: function (res) {
                        if (res.code == 0) {
                            return layer.msg(res.msg, { icon: 1, time: 900 }, function () {
                                location.reload();
                            });
                        } else {
                            return layer.msg(res.msg, { icon: 2, time: 900 });
                        }
                    }
                });

            }, function () {
            });
        }

        // 重定向
        function redirect_url(url) {
            window.location.href = url;
        }

    </script>
</body>

</html>